<%-- 
    Document   : usuario
    Created on : 25-feb-2012, 17:55:32
    Author     : BlueDeep
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Pagina principal</title>
<link href="scripts/css.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="scripts/jquery-1.7.1.min.js"></script>

<script type="text/javascript">
    $(document).ready(function(){
              rellenarGrupos();
             
               $('#loginBtn').click(function(){
                   validate();
               }
               );
                   $('#logOut').click(function(){
                   logout();
               }
               ); 
               
               $('#btnEnviar').click(function(){
                   sendUserInfo();
               });
                
    });
    function sendUserInfo(){
        $.getJSON('UserServices?p1=1&'+$.param($('#form1').serializeArray()), 
             function(data) {
                      if(data){
                          alert('Ha modificado de manera efectiva sus datos.');
                          establecerNombre();
                      }  
             });
        
    }
    function rellenarGrupos(){
        
        $.get('UserServices?p1=2', 
        function(data){
            var json = $.parseJSON(data);
           for(i=0;i<$(json).length;i++){  
            $('#gru').append('<option id="'+json[i].idgrupo+'" value="'+json[i].idgrupo+'">'+json[i].nombre+'</option>')
           }
            establecerNombre();
        }
        );
    }
    function validaEnvio(){

        if(
        !$('#tel').val().length,
        !$('#mail').val().length,
        !$('#dir').val().length)
            return false;
        //aqui validar casos especiales
    }
              
                function establecerNombre(){
                    $('body').hide();
                    $.getJSON('LoginServlet?p3=2', 
                    function(data) {
                        if(data!=null){
                                $('#nom').val(data.nombre).attr('disabled', true);
                                $('#Ap1').val(data.apellido1).attr('disabled', true);
                                $('#Ap2').val(data.apellido2).attr('disabled', true);
                                $('#tel').val(data.telefono);
                                $('#mail').val(data.email);
                                $('#dir').val(data.domicilio);
                                $('#gru option').each(
                                    function(){
                                        if($(this).val()==data.grupo)
                                            $(this).attr('selected','selected')});


                                
                                $('#bienvenido').html("Bienvenido, "+"<a href='usuario.jsp'>"+data.nombre+"</a>");
                                $('.hide').show();
                                $('body').show();
                            
                        }else
                         {
                            window.location = "index.jsp";
                         }


                        });
                }
                function logout(){
                    $.getJSON('LoginServlet?p3=3', 
                    function() {
                        window.location = "index.jsp";
                        });
                }
                
</script>
</head>

<body>
<table width="1000" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td bgcolor="#FFFFFF"><table width="1000" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td height="83" valign="top" background="images/top-bg.gif" style="padding-top:51px;">
		<table width="284" border="0" align="left" cellpadding="0" cellspacing="0">
          <tr>
        
          </tr>
          <tr>
        
          </tr>
        </table></td>
        <td width="472" background="images/top-bg.gif"><img src="images/logo.png" width="250" height="134" /></td>
      </tr>
    </table>
      <table width="1000" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td id="button-bg">
		 <ul>
		<li><a href="index.jsp">HOME</a></li>
		<li><a href="consulta.jsp">CONSULTA</a></li>
                <li ><a href="usuario.jsp">MIS DATOS</a></li>
                <li ><a href="reservas.jsp">MIS RESERVAS</a></li>
		</ul>
		  </td>
        </tr>
      </table>
<div id="login" style="float:right;">
<div id="bienvenido">   </div>  
<a href="#" id="logOut" class="hide" style="float:right;">  Salir </a>
</div>

      <table >
		   <form id="form1" name="formulario" action="UserServices" method="POST">
	<center>
			<h1> Editar Informacion Usuario</h1>
       
      <table border="0" align="center">
     
          <thead>
          </thead>
          <tbody>
            
              <tr>
                   <th>Nombre</th>
                  <td><input class="campos" type="text" name="nom" id="nom" /></td>
              </tr>
              <tr>
                   <th>Apellido 1</th>
                  <td><input class="campos" type="text" name="Ap1" id="Ap1"  /></td>
              </tr>
              <tr>
                   <th>Apellido 2</th>
                  <td><input class="campos" type="text" name="Ap2" id="Ap2" /></td>
              </tr>
           		
              <tr>
                  <th>Teléfono</th>
                  <td><input class="campos" type="text" name="tel" id="tel" /></td>
              </tr>
   
              <tr>
                  <th>Correo Electronico</th>
                  <td><input class="campos" type="text" name="mail" id="mail" /></td>
              </tr>
       
              <tr>
                  <th>Direccion</th>
                  <td><textarea name="dir" class="campos" id="dir" rows="3" name="direccion">
	               </textarea></td>
              </tr>
              <tr>
                  <th>Grupo</th>
                  <td><select id="gru" class="campos"  rows="1" name="gru">
                          <option value="2">La q no es</option>
	               </select></td>
              </tr>
          </tbody>
          <TR>
			<Th COLSPAN=2>
				<INPUT class="boton" type="button" id="btnEnviar" value="Enviar" >
				<INPUT class="boton" type="reset" value="Limpiar" name="btnLimpiar">
			</Th>
		</TR>
          <input type="hidden" id="p1" name="p1" value="1"/>
      </table>
		
                        
	</form>
		 
	 </table>
	 </center>
      
   </td>
  </tr>
</table>
</body>
</html>
